<template>
  <div>
    <h2>Child</h2>
    {{ props.msg }}
    <br />
    <button @click="handleClick">给父组件传递数据</button>
    <button @click="nohandleClick">没有传递参数</button>
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue'
// const props = defineProps(['msg'])
const props = defineProps({
  msg: {
    type: String,
    default: '默认值',
  },
})

console.log(props.msg)

// const emits = defineEmits(['click'])
const emits = defineEmits({
  click(title) {
    if (title) {
      console.log(title)
      return true
    } else {
      console.log('请输入title')
      return false
    }
  },
})

const handleClick = () => {
  emits('click', '子组件的数据')
}

const nohandleClick = () => {
  emits('click')
}
</script>
<style
  lang="scss"
  scoped
></style>
